<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <meta content="email=no" name="format-detection">
    <link rel="stylesheet" href="/static/css/wepayui.min.css">
    <link rel="stylesheet" href="/static/css/pay.css">
    <link rel="stylesheet" href="/static/css/keyboard.css">
    <script src="https://gw.alipayobjects.com/as/g/h5-lib/alipayjsapi/3.1.1/alipayjsapi.inc.min.js"></script>
    <style>
        .container {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            overflow: hidden;
        }

        .header {
            text-align: center;
        }

        #payMsg {
            font-weight: bold;
            font-size: 18px;
        }

        .logo {
            font-size: 60px;
            color: #FF6412;
            line-height: 60px;
        }
        #amount{
            font-size: 22px;
            color: #FF6412;
            font-weight: bold;
        }
    </style>

</head>
<body ontouchstart class="weui-wepay-pay-wrap">
<div class="container" id="container">
    <!--页面类容开始-->
    <div class="weui-wepay-pay">
        <div class="weui-cells">
            <div class="weui-cell weui-cell_active">
            <div class="weui-flex__item header">
                <div class="logo iconfont">
                </div>
                <div id="payMsg">支付中...</div>
            </div>
            </div>
        </div>
        <div class="weui-cells">

            <div class="weui-flex weui-cell weui-cell_active">
                <div class="weui-flex__item">
                    <div class="placeholder">店铺名称</div>
                </div>
                <div>
                    <div id="shopName">加载中...</div>
                </div>
            </div>
            <div class="weui-flex  weui-cell weui-cell_active">
                <div class="weui-flex__item">
                    <div class="placeholder">订单编号</div>
                </div>
                <div>
                    <div id="orderNo">加载中...</div>
                </div>
            </div>
            <div class="weui-flex  weui-cell weui-cell_active">
                <div class="weui-flex__item">
                    <div class="placeholder">交易时间</div>
                </div>
                <div>
                    <div id="time">加载中...</div>
                </div>
            </div>
            <div class="weui-flex weui-cell weui-cell_active">
                <div class="weui-flex__item">
                    <div class="placeholder"></div>
                </div>
                <div>
                    <div><span id="amount">加载中...</span></div>
                </div>
            </div>
        </div>
    </div>
    <!--页面类容结束-->

</div>
</body>
</html>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<script type="text/javascript">
    ap.setNavigationBar({
        title: '交易结果',
        backgroundColor: '#FF6412'
    });
    $(function () {
        var data = ap.parseQueryString();
        alert(data.shopName+'|'+data.amount+'|'+data.orderNo+'|');
        $('#shopName').html(data.shopName);
        $('#amount').html(data.amount);
        $('#orderNo').html(data.orderNo);
        $.post('/trade_query', {
            order_no: data.orderNo,
            type: 'Zfb',
            uid: data.uid
        }, function (e) {
            if (1 == e.code) {
                $('#payMsg').html(e.data.tradeStatus)
                $('#time').html(e.data.time)
                $('.logo').addClass('icon-suc')
            }else{
                $('.logo').addClass('icon-err')
                $('#payMsg').html(e.data.tradeStatus);
            }
        })
    })
</script>